<div nz-row>
  <div nz-col nzSpan="18" class="container left-container">
    <div class="header">
      用户管理
      <span class="caption">User Management</span>
    </div>

    <div class="toolbar">
      <div class="left">
        <nz-space nzSize="middle">
          <input
            *nzSpaceItem
            nz-input
            placeholder="输入任意字符搜索用户..."
            type="text"
          />
          <button *nzSpaceItem nz-button nzShape="circle">
            <i nz-icon nzType="search"></i>
          </button>
          <nz-radio-group
            *nzSpaceItem
            nzButtonStyle="solid"
            class="radio-group"
            [(ngModel)]="query.status"
          >
            <label nz-radio-button nzValue="0">
              <i nz-icon nzType="lock" nzTheme="outline"></i>
            </label>
            <label nz-radio-button nzValue="1">
              <i nz-icon nzType="unlock" nzTheme="outline"></i>
            </label>
          </nz-radio-group>
        </nz-space>
      </div>

      <div class="right">
        <sort-btn></sort-btn>
      </div>
    </div>

    <div nz-row nzGutter="24" class="body">
      <user-card nz-col nzSpan="12" class="user-item" ></user-card>
    </div>
  </div>
  <div nz-col nzSpan="6" class="container right-container">
    <div class="header">
      历史记录
      <span class="caption">History</span>
    </div>
    <div class="body"></div>
  </div>
</div>
